<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>商品详情</title>
    <link rel="stylesheet" href="/css/modules/reset.css">
    <link rel="stylesheet" href="/css/modules/header.css">
    <link rel="stylesheet" href="/css/modules/footer.css">
    <link rel="stylesheet" href="/css/details.css">
	<link rel="shortcut icon" href="/img/favicon.png">
</head>
<body>
    <header></header>
    <main>
        <div class="main-header">
            <div class="main-hd">
                <p id="navDetail">
                    <!-- <a href="/index.html">首页</a>
                    <span>></span>
                    <a href="#">女士/情侣系列</a>
                    <span>></span>
                    <b>海鸥基础系列自动机械情侣对表219.31.1014/L</b> -->
                </p>
                <script type="text/html" id="navDetailTemplate">
                    <a href="/index.html">首页</a>
                    <span>></span>
                    <a href="/html/list.html">女士/情侣系列</a>
                    <span>></span>
                    <b>{{title}}</b> 
                </script>
            </div>
        </div>
        <div class="depic" id="contDetail">
             <!-- <div>
                <img src="/img/list2.jpg" alt="" class="zoom-image">
            </div>
            <div class="imgs">
                <ul id="gal1">
                    <li>
                        <a class="zoomGalleryActive" href="javascript:;" data-image="/img/list2.jpg" data-zoom-image="/img/list2.jpg">
                            <img src="/img/list2.jpg" class="smallpic">
                        </a>
                    </li>
                </ul>
            </div>
            <div class="details-info">
                <div class="title">
                    <h3>海鸥基础系列自动机械情侣对表219.31.1014/L</h3>
                    <p class="title-p1">已设置最大优惠，无需领劵</p>
                    <p class="title-p2">【温馨提示】海鸥手表背面贴有二维码，扫码后可以查验真伪、参加积分抽奖、获得免费延保一年</p>
                </div>
                <div class="price">
                    <p class="price-p1">价格: ¥4800.00元</p>
                    <p class="price-p2">优惠价：<span class="span1">¥</span><span class="span2">2050.00元</span></p>
                    <p class="price-p3">无需领券，已为您设置最大折扣，直接购买即可</p>
                </div>
                <p class="freight">运费<span>免运费</span></p>
                <div class="shopcart">
                    <div class="color">
                        <p>颜色</p>
                        <ul>
                            <li>蓝色</li>
                        </ul>
                    </div>
                    <div class="num">
                        <p>数量 : &nbsp;&nbsp;<span>-</span><input type="text" value="1"><span>+</span></p>
                    </div>
                    <div class="stock">
                        <p>库存 : &nbsp;&nbsp;<span>0</span></p>
                    </div>
                    <div class="btn">
                        <div class="btn-left">立即购买</div>
                        <div class="btn-right">加入购物车</div>
                    </div>
                    <p class="shopcart-p">关注微信公众号：海鸥表官方商城，手机购买更方便</p>
                </div>
            </div>  -->
            <script type="text/html" id="contDetailTemplate">
                <div>
                    <img src="{{photo[0].url}}" alt="" class="zoom-image">
                </div>
                <div class="imgs">
                    <ul id="gal1">
                        {{each photo img}}
                        <li>
                            <a class="zoomGalleryActive" href="javascript:;" data-image="{{img.url}}" data-zoom-image="{{img.url}}">
                                <img src="{{img.url}}" class="smallpic">
                            </a>
                        </li>
                        {{/each}}
                    </ul>
                </div>
                <div class="details-info">
                    <div class="title">
                        <h3>{{title}}</h3>
                        <p class="title-p1">{{couponStatus}}</p>
                        <p class="title-p2">【温馨提示】海鸥手表背面贴有二维码，扫码后可以查验真伪、参加积分抽奖、获得免费延保一年</p>
                    </div>
                    <div class="price">
                        <p class="price-p1">价格: {{originPrice}}元</p>
                        <p class="price-p2">优惠价：<span class="span1">¥</span><span class="span2">{{price}}元</span></p>
                        <p class="price-p3">无需领券，已为您设置最大折扣，直接购买即可</p>
                    </div>
                    <p class="freight">运费<span>免运费</span></p>
                    <div class="shopcart">
                        <div class="color">
                            <p>颜色</p>
                            <ul>
                                <li>蓝色</li>
                            </ul>
                        </div>
                        <div class="num">
                            <p>数量 : &nbsp;&nbsp;<a id="shopcartdel" href="javascript:;">-</a><input type="text" value="1" id="shopcarttxt"><a id="shopcartadd" href="javascript:;">+</a></p>
                        </div>
                        <div class="stock">
                            <p>库存 : &nbsp;&nbsp;<span>{{saleNum}}</span></p>
                        </div>
                        <div class="btn">
                            <div class="btn-left" ><a href="javascript:;">立即购买</a></div>
                            <div class="btn-right" id="add-to-cart"><a href="javascript:;">加入购物车</a></div>
                        </div>
                        <p class="shopcart-p">关注微信公众号：海鸥表官方商城，手机购买更方便</p>
                    </div>
                </div>
                <div class="toshopcart">
                    <p><a href="/html/shopcart.html">购物车</a></p>
                    <p id="shopcartnum">0</p>
                </div>
            </script>
        </div>
    </main>
    <footer></footer>

    <script src="/libs/require/require.min.js" data-main="/js/details"></script>
</body>
</html>